<template>
	<view class="open-vip">
		<uni-card>
			<view>请选择您要开通的套餐</view>
			<view class="item" v-for="item in priceList" :key="item.vipTypeId" @click="itemClick(item)">
				{{item.vipPrice}}
			</view>
		</uni-card>
	</view>
</template>

<script setup>
	import {
		ref,
		onMounted
	} from 'vue'
	import {
		getVipPriceList,
		reqCloseOrderNo,
		reqOpenVip
	} from '@/service/modules/personal';

	import {
		usePersonalStore
	} from '../../store/index.js'

	const priceList = ref([])

	const personalStore = usePersonalStore()

	onMounted(() => {
		getVipType()
	})

	const getVipType = async () => {
		const res = await getVipPriceList()
		priceList.value = res.data
	}

	const itemClick = async (item) => {
		const res = await reqOpenVip(item.vipTypeId)
		const {
			nonceStr,
			orderNo,
			paySign,
			prepayId,
			signType,
			timeStamp
		} = res.data
		uni.requestPayment({
			"provider": "wexin",
			"nonceStr": nonceStr, // 随机字符串
			"package": "prepay_id=" + prepayId, // 固定值
			"paySign": paySign,
			"timeStamp": timeStamp, // 时间戳（单位：秒）
			"signType": signType, // 签名，这里用的 RSA 签名
			success(res) {
				uni.setStorageSync('vip', true)
				personalStore.vip = true
				console.log(res, '支付');
			},
			async fail(e) {
				// 失败的话关闭订单号
				await reqCloseOrderNo(orderNo)
				uni.showToast({
					icon: "error",
					title: "支付失败"
				})
			}
		})
	}
</script>

<style lang="scss">

</style>